<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>
    // 数组也是一种键值对（key-value）
    // 数组的key只能是数字
    const arr = [1, 2, 3]
    console.log(arr[0]);
    // 对象也是键值对结构
    // 它的key只能是字符串
    const obj = {
      name: 'xiaopang',
      age: 3
    }
    obj['0'] = 'hello' // 只能通过obj['0']来添加
    console.log(obj);

    // Map:映射表（key-value）
    // key可以是任意类型的数据 可以认为map就是一个高级版的对象
    const map = new Map()
    const foo = { foo: 1 }
    map.set(foo, 1)
    console.log(map);

    // WeakMap 弱映射表（key只能是一个对象）
    const weakmap = new WeakMap()
    const bar = { bar: 2 }
    weakmap.set(bar, 1)
    console.log(weakmap);
    // weakmap.set(2,3) 会直接报错

    {
      const map = new Map()
        ; (function () {
          const foo = { foo: 1 } // 在自执行函数中定义的变量foo执行完会被释放
          map.set(foo, 1) // 由于将foo最为map的key,导致foo占用的空间没有被释放
        })()
      console.log(map.keys());
    }

    {
      const weakmap = new WeakMap()
        ; (function () {
          const foo = { foo: 1 } 
          weakmap.set(foo, 1) // weakmap建立弱引用关系，不会保留foo空间
          // 立即执行函数执行完，foo的空间会被释放
        })()
      console.log(weakmap);
    }
  </script>
</body>

</html>